<!--
 * @Description: 秋
 * @Author: hwh
 * @Date: 2024-11-14 09:42:47
 * @LastEditors: hwh
 * @LastEditTime: 2024-11-14 10:51:49
-->
<template>
  <div class="bg">
    <!-- 注册组件 -->
    <Reg v-if="flag" />
    <!-- 登录 -->
    <login v-if="!flag" />
    <el-button>按钮</el-button>
    <p v-if="flag" @click="changeFlag">已有账号，直接<a href="">登录</a></p>
    <p v-if="!flag" @click="changeFlag">没有账号，立即<a href="">注册</a></p>

    <button @click="changeFlag">{{ flag ? '去登录页面' : '去注册页面' }}</button>
  </div>
</template>

<script setup>
import { ref } from 'vue';
import Reg from '@/components/work/Reg.vue';
import Login from '@/components/work/Login.vue';
// flag 为 true 显示注册页面
// flag 为 false 显示登录页面
const flag = ref(true);
// 切换登录注册页面
function changeFlag () {
  flag.value = !flag.value;
}
</script>
<style scoped>
.bg {
  /* background-image: url(./xxx.png); */
}
</style>